<template>
  <view class="defult-bg">
    <kui-list-page
      ref="refKmfListPage"
      :emptText="`暂无订单信息`"
      :pam="searchParam"
      :action="action"
      :itemKeyNames="itemKeyNames"
      :useTabBar="useTopTabs"
      :useSearchBar="useSearchBar"
      searchPlaceholder="请输入事件名称进行搜索"
      searchKey="eventName"
      :tabslist="tabslist"
      :tabsKey="tabsKey"
      :autoClosePullDownRefresh="true"
      listHeight="auto"
      :filterConfig="filterConfig"
      :autoRequireOnCreate="false"
      @mounted="onKuiListPageMounted"
    >
      <template #cusItem="{ list }">
        <itemOrder v-for="(item, index) in list" :info="item" :key="index" :dictConfig="dicts.sys_eventType_zhsq" />
      </template>
    </kui-list-page>
  </view>
</template>
<script setup lang="ts">
import itemOrder from "./item-order.vue";

import { ref, reactive, onMounted, onActivated } from "vue";
import { getSysDictByName, getBizDictByName } from "@/api/public/sysdict";
import { onPullDownRefresh, onLoad, onReady } from "@dcloudio/uni-app";

// 响应式数据
const refKmfListPage = ref<any>();
const action = "/kingon-zhsq/workRegistrationTotal/page";
const useTopTabs = ref<boolean>(true);
const useSearchBar = ref<boolean>(true);
const searchParam = ref<Record<string, any>>({});
const tabslist = reactive<Array<{ name: string; value: string }>>([
  { name: "事件确认", value: "0,1" },
  { name: "人员接收", value: "2" },
  { name: "处理反馈", value: "3" },
  { name: "任务核查", value: "4" },
]);
const itemKeyNames = reactive<Array<{ title: string; key: string }>>([
  { title: "", key: "eventName" },
  { title: "上报人员：", key: "registrantName" },
  { title: "事件类别：", key: "eventType" },
  { title: "", key: "registrantTime" },
]);
const tabsKey = ref<string>("eventStatus");
const filterConfig = reactive<Array<any>>([
  {
    children: false, //是否有子项
    title: "性别",
    key: "sex", //键名 接收对象名字
    isRadio: true, //是否单选 否则多选
    data: [
      {
        title: "男",
        value: "1",
      },
      {
        title: "女",
        value: "2",
      },
    ],
  },
  {
    children: false, //是否有子项
    title: "学历",
    key: "education", //键名 接收对象名字
    isRadio: true, //是否单选 否则多选
    data: [
      {
        title: "中专",
        value: "1",
      },
      {
        title: "高中",
        value: "0",
      },
      {
        title: "本科",
        value: "2",
      },
    ],
  },
]);

const dicts = reactive<Record<string, any>>({});

onLoad(async () => {
  await initDict();
  await initData();
});

onMounted(async () => {
  console.log("onMounted", { dicts, refKmfListPage: refKmfListPage.value });
});

onReady(() => {
  console.log("onReady", { dicts, refKmfListPage: refKmfListPage.value });
   refKmfListPage.value.loadList();
  setTimeout(() => {
    console.log("setTimeout", { refKmfListPage: refKmfListPage.value });
  }, 5000);
});

onPullDownRefresh(async () => {
  console.log("onPullDownRefresh", refKmfListPage.value);
  await refKmfListPage.value.loadList();
});

const onKuiListPageMounted = (listpage:any) => {
  console.log("onKuiListPageMounted", refKmfListPage.value, listpage);
  refKmfListPage.value = listpage;
  refKmfListPage.value.loadList();
}

/**
 * 初始化字典
 * @param callback
 */
async function initDict() {
  try {
    {
      // 系统字典
      const sysMap = ["sys_eventType_zhsq"];
      for (const v of sysMap) {
        const { data } = await getSysDictByName(v);
        dicts[v] = data;
      }
    }
    {
      // 业务字典
      const sysMap = [];
      for (const v of sysMap) {
        const { data } = await getBizDictByName({ code: v });
        dicts[v] = data;
      }
    }
    console.log("初始化字典成功：", dicts);
    return dicts;
  } catch (error) {
    console.error("初始化字典失败：", error);
    return error;
  }
}

async function initData() {
  // await this.$nextTick();
  console.log("initData", dicts.sys_eventType_zhsq);
  filterConfig.push({
    children: false, //是否有子项
    title: "事件类别",
    key: "eventType", //键名 接收对象名字
    isRadio: true, //是否单选 否则多选
    defaultIndex: 0,
    data: dicts.sys_eventType_zhsq.map((v) => {
      return {
        title: v.dictLabel,
        value: v.dictValue,
      };
    }),
  });
}
</script>
<style lang="scss" scoped>
.defult-bg {
  background-color: rgb(240, 240, 240);
}
</style>
